<template>
    <basic-container class="bonus">
        <div class="search-form">
          <el-button type="primary" @click="newBtn">新增</el-button>
          <el-button type="primary" @click="copyBtn">复制</el-button>
        </div>
        <el-table :data="nameTableData" v-loading="tableLoading" border height="calc(100vh - 230px)">
          <el-table-column type="index" label="序号" width="55" align="center">
            <template slot-scope="scope" >
               <span>{{pageSize * (pageIndex - 1) + scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="templateName"
            label="模板名称"
            align="left"
          ></el-table-column>
          <el-table-column
            prop="createTime"
            label="创建时间"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="createUserName"
            label="创建人"
            align="center"
          ></el-table-column>
          <el-table-column prop="isEffective" label="有效性" align="center">
            <template slot-scope="scope">
              <i v-if="scope.row.isEffective == 1" class="el-icon-circle-check green"></i>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="200px" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="edit(scope.row)">编辑</el-button>
              <el-button type="text" @click="delBtn(scope.row)" class="delete_btn">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="avue-crud__pagination">
          <el-pagination
            @size-change="sizeChangeHandle"
            @current-change="currentChangeHandle"
            :current-page="pageIndex"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            :total="totalPage"
            background
            layout="total, sizes, prev, pager, next, jumper"
          >
          </el-pagination>
        </div>
        <el-dialog
          width="30%"
          title="复制模板"
          :visible.sync="innerVisible"
          :close-on-click-modal="false"
        >
          <el-form
            :model="detailForm"
            ref="ruleForm"
            :rules="rules"
            label-width="120px"
            class="flex"
          >
            <el-form-item label="模板名称" prop="templateName">
              <el-input v-model="detailForm.templateName"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" plain @click="detailCopy('ruleForm')">确定</el-button>
            </el-form-item>
          </el-form>
        </el-dialog>
        <el-dialog
          :title="dialogtitle"
          :visible.sync="mbstepsDialogVisible"
          width="80%"
          top="10vh"
          class="bonus fix-height"
          :close-on-click-modal="false"
        >

         <div class=" flex-l-r">
                <el-form
                  :model="ruleForm"
                  ref="ruleForm"
                  :rules="rules"
                  label-width="90px"
                  :inline="true"
                >
                  <el-form-item
                    label="模板名称"
                    prop="templateName"
                  >
                    <el-input v-model="ruleForm.templateName"></el-input>
                  </el-form-item>
                  <el-form-item>
                    <el-button type="primary" plain @click="submitForm('ruleForm')">确定</el-button>
                  </el-form-item>
                </el-form>
                <div v-if="tableData.length > 1">
                  <el-button type="primary" plain @click="saveBtn" v-loading.fullscreen.lock="fullscreenLoading2">模板保存</el-button>
                  <el-button type="primary" plain @click="copyBtnDtail" v-loading.fullscreen.lock="fullscreenLoading2">复制</el-button>
                </div>
              </div>
         <content-scroll :spaceBlockHeight="320">
          <div v-loading="loading">
              <div class="tiao_lc mg-b20" v-if="tableData.length > 1">
                流程图
              </div>
              <div class="bg_tiao" v-if="tableData.length > 1"></div>
              <div class="text_dh_box" v-if="tableData.length > 1">
                <div class="text_dh">
                  <div class="text">开始</div>
                  <img class="imgs" src="./start.png" alt="" @click="editmbsteps('该节点无配置')"/>
                </div>
<!--                <div class="text_dh">
                  <div class="text">合同创建</div>
                  <div class="chenck_active" @click="editmbsteps('该节点无配置')">
                    <i class="el-icon-check checked2"></i>
                  </div>
                </div>-->
                <div class="text_dh">
                  <div class="text">指标拟定</div>
                  <div>
                    <div class="chenck_active" v-if="from1.isjump" @click="editmbsteps('该节点无配置')">
                      <i class="el-icon-check checked2"></i>
                    </div>
                    <div v-else class="point" @click="editmbsteps('该节点无配置')"></div>
                  </div>
                  <el-checkbox v-model="from1.isjump" @change="valueChange(from1)">启用</el-checkbox>
                </div>
                <div class="text_dh">
                  <div class="text">汇总</div>
                  <div v-if="from2.isauto == 0" class="chenck_active" @click="editmbsteps('汇总')">
                    <i class="el-icon-check checked2"></i>
                  </div>
                  <div v-else @click="editmbsteps('汇总')" class="chenck_active2">
                    <i class="el-icon-check checked"></i>
                  </div>
                </div>
                <div class="text_dh">
                  <div class="text">文本审核</div>
                  <div v-if="from2.isauto == 0" class="chenck_active" @click="editmbsteps('该节点无配置')">
                    <i class="el-icon-check checked2"></i>
                  </div>
                  <div v-else @click="editmbsteps('文本审核')" class="chenck_active2">
                    <i class="el-icon-check checked"></i>
                  </div>
                </div>
                <div class="text_dh">
                  <div class="text">发起签订</div>
                  <div class="chenck_active" @click="editmbsteps('该节点无配置')">
                    <i class="el-icon-check checked2"></i>
                  </div>
                </div>
                <div class="text_dh">
                  <div class="text">受约人确认</div>
                  <div>
                    <div class="chenck_active" v-if="from4.isjump" @click="editmbsteps('该节点无配置')">
                      <i class="el-icon-check checked2"></i>
                    </div>
                    <div v-else class="point" @click="editmbsteps('该节点无配置')"></div>
                  </div>
                  <el-checkbox v-model="from4.isjump" @change="valueChange(from4)">启用</el-checkbox>
                </div>
                <div class="text_dh">
                  <div class="text">办公室审核</div>
                  <div>
                    <div class="chenck_active" v-if="from5.isjump" @click="editmbsteps('该节点无配置')">
                      <i class="el-icon-check checked2"></i>
                    </div>
                    <div v-else class="point" @click="editmbsteps('该节点无配置')"></div>
                  </div>
                  <el-checkbox v-model="from5.isjump" :disabled="disabled" @change="valueChange(from5)">启用</el-checkbox
                  >
                </div>
                <div class="text_dh">
                  <div class="text">发约人确认</div>
                  <div>
                    <div class="chenck_active" v-if="from6.isjump" @click="editmbsteps('该节点无配置')">
                      <i class="el-icon-check checked2"></i>
                    </div>
                    <div v-else class="point" @click="editmbsteps('该节点无配置')"></div>
                  </div>
                  <el-checkbox v-model="from6.isjump" @change="valueChange(from6)">启用</el-checkbox>
                </div>
                <div class="text_dh">
                  <div class="text">结束</div>
                  <img class="imgs" src="./end.png" alt="" @click="editmbsteps('该节点无配置')"/>
                </div>
              </div>
              <div
                class="tiao_lc margin-tb-20"
                v-if="
                showType == '汇总' ||
                showType == '结果汇总' ||
                showType == '文本审核' ||
                showType == '领导审核' ||
                showType == '请点击节点进行配置' ||
                showType == '该节点无配置'
              "
              >
                {{ showType }}
              </div>
              <div class="mb_bottom" v-if="tableData.length > 1">
                <el-form
                  ref="form"
                  :model="from2"
                  label-width="170px"
                  :inline="true"
                  v-if="
                  showType == '汇总' ||
                  showType == '结果汇总' ||
                  showType == '文本审核' ||
                  showType == '领导审核'
                "
                >
                  <el-form-item label="该节点是否自动执行:" v-if="showType == '汇总'">
                    <el-select v-model="from2.isauto" placeholder="请选择" @change="valueChange(from2)">
                      <el-option
                        v-for="item in options"
                        :label="item.label"
                        :key="item.value"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="文本审核审批类型:" v-if="showType == '文本审核'">
                    <el-select v-model="from3.tagType" placeholder="请选择" @change="valueChange(from3)">
                      <el-option
                        v-for="item in wboptions"
                        :label="item.label"
                        :key="item.value"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="文本审核审批人员：" v-if="showType == '文本审核'">
                    <el-button plain type="primary" @click="choosePer(from3)">选择</el-button>
                  </el-form-item>
                  <el-form-item label="该节点是否自动执行:" v-if="showType == '结果汇总'">
                    <el-select v-model="from7.isauto" placeholder="请选择" @change="valueChange(from7)">
                      <el-option
                        v-for="item in options"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="领导审核审批人员：" v-if="showType == '领导审核'">
                    <el-button plain type="primary" @click="choosePer(from8)">选择</el-button>
                  </el-form-item>
                </el-form>
                <div class="text_dh" v-else>
                  <svg
                    width="150"
                    viewBox="0 0 79 86"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    xmlns:xlink="http://www.w3.org/1999/xlink"
                  >
                    <defs>
                      <linearGradient
                        id="linearGradient-1-1"
                        x1="38.8503086%"
                        y1="0%"
                        x2="61.1496914%"
                        y2="100%"
                      >
                        <stop stop-color="#FCFCFD" offset="0%"></stop>
                        <stop stop-color="#EEEFF3" offset="100%"></stop>
                      </linearGradient>
                      <linearGradient
                        id="linearGradient-2-1"
                        x1="0%"
                        y1="9.5%"
                        x2="100%"
                        y2="90.5%"
                      >
                        <stop stop-color="#FCFCFD" offset="0%"></stop>
                        <stop stop-color="#E9EBEF" offset="100%"></stop>
                      </linearGradient>
                      <rect
                        id="path-3-1"
                        x="0"
                        y="0"
                        width="17"
                        height="36"
                      ></rect>
                    </defs>
                    <g
                      id="Illustrations"
                      stroke="none"
                      stroke-width="1"
                      fill="none"
                      fill-rule="evenodd"
                    >
                      <g
                        id="B-type"
                        transform="translate(-1268.000000, -535.000000)"
                      >
                        <g
                          id="Group-2"
                          transform="translate(1268.000000, 535.000000)"
                        >
                          <path
                            id="Oval-Copy-2"
                            d="M39.5,86 C61.3152476,86 79,83.9106622 79,81.3333333 C79,78.7560045 57.3152476,78 35.5,78 C13.6847524,78 0,78.7560045 0,81.3333333 C0,83.9106622 17.6847524,86 39.5,86 Z"
                            fill="#F7F8FC"
                          ></path>
                          <polygon
                            id="Rectangle-Copy-14"
                            fill="#E5E7E9"
                            transform="translate(27.500000, 51.500000) scale(1, -1) translate(-27.500000, -51.500000) "
                            points="13 58 53 58 42 45 2 45"
                          ></polygon>
                          <g
                            id="Group-Copy"
                            transform="translate(34.500000, 31.500000) scale(-1, 1) rotate(-25.000000) translate(-34.500000, -31.500000) translate(7.000000, 10.000000)"
                          >
                            <polygon
                              id="Rectangle-Copy-10"
                              fill="#E5E7E9"
                              transform="translate(11.500000, 5.000000) scale(1, -1) translate(-11.500000, -5.000000) "
                              points="2.84078316e-14 3 18 3 23 7 5 7"
                            ></polygon>
                            <polygon
                              id="Rectangle-Copy-11"
                              fill="#EDEEF2"
                              points="-3.69149156e-15 7 38 7 38 43 -3.69149156e-15 43"
                            ></polygon>
                            <rect
                              id="Rectangle-Copy-12"
                              fill="url(#linearGradient-1-1)"
                              transform="translate(46.500000, 25.000000) scale(-1, 1) translate(-46.500000, -25.000000) "
                              x="38"
                              y="7"
                              width="17"
                              height="36"
                            ></rect>
                            <polygon
                              id="Rectangle-Copy-13"
                              fill="#F8F9FB"
                              transform="translate(39.500000, 3.500000) scale(-1, 1) translate(-39.500000, -3.500000) "
                              points="24 7 41 7 55 -3.63806207e-12 38 -3.63806207e-12"
                            ></polygon>
                          </g>
                          <rect
                            id="Rectangle-Copy-15"
                            fill="url(#linearGradient-2-1)"
                            x="13"
                            y="45"
                            width="40"
                            height="36"
                          ></rect>
                          <g
                            id="Rectangle-Copy-17"
                            transform="translate(53.000000, 45.000000)"
                          >
                            <mask id="mask-4-1" fill="white">
                              <use xlink:href="#path-3-1"></use>
                            </mask>
                            <use
                              id="Mask"
                              fill="#E0E3E9"
                              transform="translate(8.500000, 18.000000) scale(-1, 1) translate(-8.500000, -18.000000) "
                              xlink:href="#path-3-1"
                            ></use>
                            <polygon
                              id="Rectangle-Copy"
                              fill="#D5D7DE"
                              mask="url(#mask-4-1)"
                              transform="translate(12.000000, 9.000000) scale(-1, 1) translate(-12.000000, -9.000000) "
                              points="7 0 24 0 20 18 -1.70530257e-13 16"
                            ></polygon>
                          </g>
                          <polygon
                            id="Rectangle-Copy-18"
                            fill="#F8F9FB"
                            transform="translate(66.000000, 51.500000) scale(-1, 1) translate(-66.000000, -51.500000) "
                            points="62 45 79 45 70 58 53 58"
                          ></polygon>
                        </g>
                      </g>
                    </g>
                  </svg>
                  <span style="margin: 0; -size: 14px; color: #909399"
                  >暂无节点配置</span
                  >
                </div>
                <div class="per" v-if="showType == '文本审核' || showType == '领导审核'">
                <span v-for="item in perList" :key="item.userName">{{ item.userName }}</span>
                </div>
              </div>
            </div>
          </content-scroll>
        </el-dialog>
        <!--复制模板-->
        <el-dialog
          title="复制模板"
          :visible.sync="dialogVisible"
          width="30%"
          :close-on-click-modal="false"
        >
          <el-form
            ref="formcopy"
            :rules="rulescopy"
            :model="formcopy"
            label-width="120px"
          >
            <el-form-item
              label="模板名称"
              prop="templateNamecopy"
            >
              <el-input v-model="formcopy.templateNamecopy"></el-input>
            </el-form-item>
            <el-form-item label="模板选择" prop="per">
              <el-select
                v-model="formcopy.tempId"
                placeholder="请选择模板"
              >
                <el-option
                  v-for="(item, index) in tempData"
                  :key="index"
                  :label="item.templateName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitFormcopy('formcopy')">确定</el-button>
            <el-button @click="backBtn">取消</el-button>
          </span>
        </el-dialog>

      <sortingPerChooseDialog
        :sortingPerChooseDialogData="sortingPerChooseDialogData"
        @sortingPerChooseDialogChild="sortingPerChooseDialogChild"
      ></sortingPerChooseDialog>
   </basic-container>
</template>
<script>
import {
  getTempList,
  tempage,
  saveTemplateName,
  isExsitTemplateName,
  saveTemplatehang,
  effective,
  deleteBatchtem,
  copyTemplateMainAndDetail,
} from "@/api/bonus/calculateexamineconfig";
import contentScroll from "@/views/bonusmanage/components/contentScroll";
import sortingPerChooseDialog from "@/views/hetongrenwu/components/sortingPerChooseDialog.vue";
export default {
  components: {
    contentScroll,
    sortingPerChooseDialog,
  },
  data() {
    return {
      nameTableData: [],
      tableData: [],
      tempData: [],
      formcopy: {},
      dialogVisible: false,
      perList: [],
      ruleForm: {
        templateName: "",
      },
      disabled: false,
      sortingPerChooseDialogData: {},
      tableLoading: false,
      options: [
        { label: "是", value: "1" },
        { label: "否", value: "0" },
      ],
      wboptions: [
        { label: "会签", value: "1" },
        { label: "顺序签", value: "0" },
      ],
      id: "",
      from1: {},
      from2: {},
      from3: {},
      from4: {},
      from5: {},
      from6: {},
      from7: {},
      from8: {},
      from9: {},
      from10: {},
      rulescopy: {
        templateNamecopy: [
          { required: true, message: "请输入模板名称", trigger: "blur" },
        ],
      },
      rules: {
        templateName: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
        ],
      },
      checked: false,
      showType: "",
      mbstepsDialogVisible: false,
      dialogtitle: "",
      fullscreenLoading2: false,
      loading: false,
      innerVisible: false,
      detailForm: {},
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
    };
  },
  watch: {},
  created() {
    this.getemNameList();
    this.from1 = {};
    this.from2 = {};
    this.from3 = {};
    this.from4 = {};
    this.from5 = {};
    this.from6 = {};
    this.from7 = {};
    this.from8 = {};
    this.from9 = {};
    this.from10 = {};
    this.id = "";
  },
  methods: {
    newBtn() {
      this.dialogtitle = "新增";
      this.tableData = [];
      this.id = "";
      this.from1 = {};
      this.from2 = {};
      this.from3 = {};
      this.from4 = {};
      this.from5 = {};
      this.from6 = {};
      this.from7 = {};
      this.from8 = {};
      this.from9 = {};
      this.from10 = {};
      this.ruleForm = {};
      this.mbstepsDialogVisible = true;
      this.showType = "";
    },
    copyBtn() {
      this.dialogVisible = true;
      this.formcopy = {};
      effective({
        tagName: "业绩合同",
      }).then((res) => {
        this.tempData = res.data.data;
        this.$forceUpdate();
      });
    },
    copyBtnDtail() {
      this.ruleForm = {};
      this.innerVisible = true;
    },
    detailCopy(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          isExsitTemplateName({
            templateName: this.detailForm.templateName,
            tagName: "业绩合同",
          }).then((res) => {
            if (!res.data.data.flag) {
              var parmas = {
                newtempName: this.detailForm.templateName,
                oldId: this.id,
              };
              this.save(parmas);
            } else {
              this.$message.warning("模板名称已存在");
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    backBtn() {
      this.dialogVisible = false;
      this.innerVisible = false;
      this.formcopy = {};
      this.tempData = [];
    },
    // 节点编辑
    editmbsteps(e) {
      this.showType = e;
      if (e == "文本审核") {
        this.perList = JSON.parse(this.from3.userjson).reverse();
      } else if ("领导审核") {
        this.perList = JSON.parse(this.from8.userjson).reverse();
        this.from8.tagType = 0;
      }
    },
    valueChange(e) {
      console.log(e);
      var row = {};
      if (e.stepName == "指标拟定") {
        row = this.from1;
      } else if (e.stepName == "汇总") {
        row = this.from2;
      } else if (e.stepName == "文本审核") {
        row = this.from3;
      } else if (e.stepName == "受约人确认") {
        row = this.from4;
        if (this.from4.isjump == false) {
          this.disabled = true;
          this.from5.isjump = true;
          saveTemplatehang(this.from5).then((res) => {
            this.fngetTempList();
          });
        } else {
          this.disabled = false;
        }
      } else if (e.stepName == "合同发起人确认") {
        row = this.from5;
      } else if (e.stepName == "发约人确认") {
        row = this.from6;
      } else if (e.stepName == "结果汇总") {
        row = this.from7;
      } else if (e.stepName == "领导审核") {
        row = this.from8;
      } else if (e.stepName == "发起预填报") {
        row = this.from9;
      } else if (e.stepName == "发起填报") {
        row = this.from10;
      }
      if (row.isjump == false) {
        row.isjump = true;
      } else {
        row.isjump = false;
      }
      this.savetem(row);
    },
    savetem(row) {
      saveTemplatehang(row)
        .then((res) => {
          this.$message.success(row.stepName + "保存成功");
          this.fngetTempList();
        })
        .catch((res) => {});
    },
    submitFormcopy(formName) {
      var parmas = {
        newtempName: this.formcopy.templateNamecopy,
        oldId: this.formcopy.tempId,
      };
      this.$refs[formName].validate((valid) => {
        if (valid) {
          isExsitTemplateName({
            templateName: this.formcopy.templateNamecopy,
            tagName: "业绩合同",
          }).then((res) => {
            console.log(res.data.data.flag);
            if (res.data.data.flag) {
              this.$message.warning(
                "模板名称" + this.formcopy.templateNamecopy + "已存在"
              );
            } else {
              this.save(parmas);
            }
          });
        } else {
          return false;
        }
      });
    },
    save(parmas) {
      copyTemplateMainAndDetail(parmas).then((response) => {
        if (response.data.code == 0) {
          this.$message.success(response.data.data);
          this.backBtn();
          this.getemNameList();
        }
      });
    },
    // 新增模板
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          isExsitTemplateName({
            templateName: this.ruleForm.templateName,
            tagName: "业绩合同",
          }).then((res) => {
            if (!res.data.data.flag) {
              saveTemplateName({
                templateName: this.ruleForm.templateName,
                id: this.id,
                tagName: "业绩合同",
              }).then((res) => {
                this.id = res.data.data.id;
                this.fngetTempList(res.data.data);
                this.getemNameList();
              });
            } else {
              this.$message.warning("模板名称已存在");
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    //获取模板列表
    getemNameList() {
      this.tableLoading = true;
      tempage({
        tagName: "业绩合同",
        current: this.pageIndex,
        size: this.pageSize,
      }).then((res) => {
        this.tableLoading = false;
        this.nameTableData = res.data.data.records;
        this.totalPage = res.data.data.total;
        this.showType = "请点击节点进行配置";
      });
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val;
      this.pageIndex = 1;
      this.getemNameList();
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val;
      this.getemNameList();
    },
    // 模板提交至有效
    saveBtn() {
      var params = {
        isEffective: 1,
        id: this.id,
        tagName: "业绩合同",
      };
      if (this.from2.isauto == null) {
        this.$message.warning("请完成“汇总”节点的配置");
      } else if (
        (this.from3.tagType == null ||
          JSON.parse(this.from3.userjson).length == 0) &&
        this.from2.isauto == "1"
      ) {
        this.$message.warning("请完成“文本审核”节点的配置");
      } else if (this.from7.isauto == null) {
        this.$message.warning("请完成“结果汇总”节点的配置");
      } else if (JSON.parse(this.from8.userjson).length == 0 &&this.from7.isauto == "1") {
        this.$message.warning("请完成“领导审核”节点的配置");
      } else if (this.from9.isjump == false && this.from10.isjump == false) {
        this.$message.warning("请勾选“发起预填报”或“正式填报”");
      } else {
        this.fullscreenLoading2 = true;
        saveTemplateName(params)
          .then((res) => {
            this.$message.success("提交成功");
            this.fullscreenLoading2 = false;
            this.getemNameList();
            this.mbstepsDialogVisible = false;
          })
          .catch((res) => {
            this.fullscreenLoading2 = false;
          });
      }
    },

    edit(row) {
      this.dialogtitle = row.templateName;
      this.ruleForm.templateName = row.templateName;
      this.id = row.id;
      this.showType = "请点击节点进行配置";
      this.fngetTempList();
    },
    // 编辑
    fngetTempList() {
      var params = {
        mainId: this.id,
      };
      this.loading = true;
      getTempList(params)
        .then((res) => {
          this.tableData = res.data.data;
          this.from1 = res.data.data[0];
          if (this.from1.isjump == "false") {
            this.from1.isjump = true;
          } else {
            this.from1.isjump = false;
          }
          this.from2 = res.data.data[1];
          this.from3 = res.data.data[2];
          this.from4 = res.data.data[3];
          if (this.from4.isjump == "false") {
            this.from4.isjump = true;
          } else {
            this.disabled = true;
            this.from4.isjump = false;
          }
          this.from5 = res.data.data[4];
          if (this.from5.isjump == "false") {
            this.from5.isjump = true;
          } else {
            this.from5.isjump = false;
          }
          this.from6 = res.data.data[5];
          if (this.from6.isjump == "false") {
            this.from6.isjump = true;
          } else {
            this.from6.isjump = false;
          }
          this.from7 = res.data.data[6];
          this.from8 = res.data.data[7];
          this.from9 = res.data.data[8];
          if (this.from9.isjump == "false") {
            this.from9.isjump = true;
          } else {
            this.from9.isjump = false;
          }
          this.from10 = res.data.data[9];
          if (this.from10.isjump == "false") {
            this.from10.isjump = true;
          } else {
            this.from10.isjump = false;
          }
          this.mbstepsDialogVisible = true;
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },
    delBtn(row) {
      var params = {
        ids: row.id,
      };
      this.$confirm("确定要删除么？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then((_) => {
          deleteBatchtem(params).then((res) => {
            this.$message.success("删除成功");
            this.getemNameList();
          });
        })
        .catch((_) => {});
    },
    choosePer(row) {
      this.sortingPerChooseDialogData = {
        visible: true,
        rows: row,
        perLsit: JSON.parse(row.userjson).reverse(),
        types: "temper",
      };
    },
    sortingPerChooseDialogChild(res) {
      this.fngetTempList();
      this.editmbsteps(this.showType);
    },
  },
};
</script>
<style scoped>
.tiao_lc {
  width: 100%;
  background: #eeeeee;
  padding: 10px;
  color: #0762c3;
}
.text_dh_box{
  display: flex;
  justify-content: space-between;
  width: 100%;
  z-index: 8;
  position: sticky;
}
.text_dh_box.two{
  margin-top: 20px;
  width: 69%;
}
.text_dh {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.text_dh .text{
  color: #0762c3;
  margin: 0 10px;
}
.mb_bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 230px;
}
.bg_tiao {
  width: 100%;
  background: #a9c6ea;
  height: 4px;
  top: 45px;
  position: relative;
  z-index: 2;
}
.bg_tiaoTwo {
  width: 69%;
  background: #a9c6ea;
  height: 4px;
  top: 65px;
  position: relative;
  z-index: 2;
}
.point {
  width: 31px;
  height: 31px;
  margin: 0 3px 6px 3px;
  border-radius: 50%;
  background: #dbe2f2;
  box-shadow: 4px 4px 6px #888888;
}
.chenck_active {
  width: 31px;
  height: 31px;
  margin: 0 3px 6px 3px;
  border-radius: 50%;
  background: #0a66c2;
  box-shadow: 4px 4px 6px #888888;
  text-align: center;
}
.chenck_active2 {
  width: 31px;
  height: 31px;
  margin: 0 3px 6px 3px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 4px 4px 6px #888888;
  text-align: center;
}
.imgs {
  width: 31px;
  height: 31px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 4px 4px 6px #888888;
}
.checked {
  font-size: 20px;
  border-radius: 50%;
  color: #0a66c2;
  line-height: 31px;
  background: #fff;
}
.checked2 {
  color: #fff;
  font-size: 20px;
  line-height: 31px;
  text-align: center;
  background: #0a66c2;
  border-radius: 50%;
}
.per {
  width: 80%;
  height: 84px;
  border-radius: 5px;
  border: 2px #ededf1 solid;
  padding: 20px;
}
</style>
